/**
 * params 传参数
 * 
 * <Link to="/地址/参数1/参数2" > 跳转到xx  </Link>
 * <Route path="/地址/:变量1/:变量2" />
 * 
 * 函数组件：
 * import { useParams } from "react-router-dom"
 * const p= useParams();//参数对象
 * 
 * class 组件
 * v5 版本 ：this.props
 
 * v6 默认没有，需要自己写 函数组件，传入
  function withRouter(Component) {
    return (props) => (
      <Component
        {...props}
        params={useParams()}
        location={useLocation()}
        navigate={useNavigate()}
      />
    );
  }

  组件{
      this.props  
  }

export default withRouter(组件);

 * 
 */

// 函数组件
/*
import { useParams } from "react-router-dom"
function Info(){

    const p= useParams();
    console.log(p)
    return <div>商品详情</div>
}

export default Info;

*/


// class 组件
import React, { Component } from 'react'
import {useParams,useLocation,useNavigate}  from "react-router-dom"

function withRouter(Component) {
    return (props) => (
      <Component
        {...props}
        params={useParams()}
        location={useLocation()}
        navigate={useNavigate()}
      />
    );
  }


 class Info extends Component {
    
  render() {
    console.log(this.props)
    return (
      <div>Info</div>
    )
  }
}

export default withRouter(Info);